<template>
  <div class="demo-image">
    <div class="block" v-for="fit in fits" :key="fit">
      <span class="demonstration">{{ }}</span>
      <el-image
        style="width: 100%;"
        :src="url"
        :fit="fit"></el-image>
    </div>

    <el-tabs type="border-card">
      <el-tab-pane label="设计">
        设计<hr>

        <template>
          <el-table
            :data="tableData"
            style="width: 100%">
            <el-table-column
              prop="date"
              label="日期"
              width="180">
            </el-table-column>
            <el-table-column
              prop="name"
              label="姓名"
              width="180">
            </el-table-column>
            <el-table-column
              prop="address"
              label="地址">
            </el-table-column>
          </el-table>
        </template>

        <div class="block">

          <el-image :src="src">
            <div slot="placeholder" class="image-slot">
              加载中<span class="dot">...</span>
            </div>
          </el-image>
        </div>

      </el-tab-pane>
      <el-tab-pane label="市场">

        <div class="block">
          <el-image :src="src"></el-image>
        </div>


      </el-tab-pane>
      <el-tab-pane label="开发">开发</el-tab-pane>
    </el-tabs>

  </div>
</template>

<script>
export default {
  name: "MyHomeWork",
  data() {
    return {
      fits: ['scale-down'],
      url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
      src: 'https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg'

    }
  }
}
</script>

<style scoped>

</style>
